<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>ueditor图片对话框</title>
	<script type="text/javascript" src="./dialogs/internal.js"></script>

	<!-- jquery -->
	<script type="text/javascript" src="./third-party/jquery-1.10.2.min.js"></script>

	<!-- webuploader -->
	<script src="./third-party/webuploader/webuploader.min.js"></script>
	<link rel="stylesheet" type="text/css" href="./third-party/webuploader/webuploader.css">

	<!-- image dialog -->
	<link rel="stylesheet" href="./dialogs/image/image.css" type="text/css"/>
</head>


<body style="">

<div class="wrapper">
	<div id="tabhead" class="tabhead">
		<span class="tab" data-content-id="remote">插入图片</span>
		<span class="tab focus" data-content-id="upload">本地上传</span>
		<span class="tab" data-content-id="online">在线管理</span>
		<span class="tab" data-content-id="search">图片搜索</span>
	</div>
	<div class="alignBar">
		<label class="algnLabel">图片浮动方式：</label>
		<span id="alignIcon">
                        <span id="noneAlign" class="none-align focus" data-align="none" title="无浮动"></span>
                        <span id="leftAlign" class="left-align" data-align="left" title="左浮动"></span>
                        <span id="rightAlign" class="right-align" data-align="right" title="右浮动"></span>
                        <span id="centerAlign" class="center-align" data-align="center" title="居中独占一行"></span>
                    </span>
		<input id="align" name="align" type="hidden" value="none">
	</div>
	<div id="tabbody" class="tabbody">

		<!-- 远程图片 -->
		<div id="remote" class="panel">
			<div class="top">
				<div class="row">
					<label for="url">地 址：</label>
					<span><input class="text" id="url" type="text"></span>
				</div>
			</div>
			<div class="left">
				<div class="row">
					<label>大 小：</label>
					<span>宽度<input class="text" type="text" id="width">px </span>
					<span>高度<input class="text" type="text" id="height">px </span>
					<span><input id="lock" type="checkbox" disabled="disabled" title="锁定宽高比例"><span
							id="lockicon"></span></span>
				</div>
				<div class="row">
					<label>边 框：</label>
					<span><input class="text" type="text" id="border">px </span>
				</div>
				<div class="row">
					<label>边 距：</label>
					<span><input class="text" type="text" id="vhSpace">px </span>
				</div>
				<div class="row">
					<label>描 述：</label>
					<span><input class="text" type="text" id="title"></span>
				</div>
			</div>
			<div class="right">
				<div id="preview"></div>
			</div>
		</div>

		<!-- 上传图片 -->
		<div id="upload" class="panel focus">
			<div id="queueList" class="queueList">
				<div class="statusBar element-invisible">
					<div class="progress" style="display: none;">
						<span class="text">0%</span>
						<span class="percentage"></span>
					</div>
					<div class="info"></div>
					<div class="btns">
						<div id="filePickerBtn"></div>
						<div class="uploadBtn">开始上传</div>
					</div>
				</div>
				<div id="dndArea" class="placeholder">
					<div class="filePickerContainer">
						<div id="filePickerReady" style="display: none;"></div>
						<div>后端配置项没有正常加载，上传插件不能正常使用！</div>
					</div>
				</div>
				<ul class="filelist element-invisible">
					<li id="filePickerBlock" class="filePickerBlock"></li>
				</ul>
			</div>
		</div>

		<!-- 在线图片 -->
		<div id="online" class="panel">
			<div id="imageList">　图片加载中……</div>
		</div>

		<!-- 搜索图片 -->
		<div id="search" class="panel">
			<div class="searchBar">
				<input id="searchTxt" class="searchTxt text" type="text">
				<select id="searchType" class="searchType" title="图片类型">
					<option value="&amp;s=4&amp;z=0">新闻</option>
					<option value="&amp;s=1&amp;z=19">壁纸</option>
					<option value="&amp;s=2&amp;z=0">表情</option>
					<option value="&amp;s=3&amp;z=0">头像</option>
				</select>
				<input id="searchReset" type="button" value="清空搜索">
				<input id="searchBtn" type="button" value="百度一下">
			</div>
			<div id="searchList" class="searchList">
				<ul id="searchListUl"></ul>
			</div>
		</div>

	</div>
</div>

<style>
    .tabhead {
        position: relative;
        z-index: 10;
    }

    .tabhead span {
        display: inline-block;
        padding: 0 5px;
        height: 30px;
        border: 1px solid #ccc;
        background: url(images/dialog-title-bg.png) repeat-x;
        text-align: center;
        line-height: 30px;
        cursor: pointer;
        *margin-right: 5px;
    }

    .tabhead span.focus {
        height: 31px;
        border-bottom: none;
        background: #fff;
    }
</style>
<script type="text/javascript" src="./dialogs/image/image.js"></script>


</body>

</html>